// React基础组件
import React from 'react'
// dva 连接组件 - 连接route和model
import { connect } from 'dva'
// 引入antd的组件
import { Table, Form, Radio, Tree, Button, Popconfirm, Modal, Row, Col, Input, Select, Cascader, Icon, Checkbox, Tabs, DatePicker, message } from 'antd'
//导入路由组件，用于跳转等
import { Link, hashHistory } from 'dva/router'
// 导入项目全局配置文件
import config from 'config/config'
// 引入model取值工具方法
import { mapStateToProps } from 'utils/view_utils'
// 当前组件样式
import styles from './policyListStyle.less'
import { CollapsiblePanels } from 'widget/CollapsiblePanels/index'
import { Grid } from 'widget/Grid/index'
import moment from 'moment';
const FormItem = Form.Item
const { RangePicker } = DatePicker
const { Option } = Select;
const { TreeNode } = Tree
import ListPage from 'widget/PageTmpl/ListPageQiance'
import classnames from 'classnames/bind';
import FlagBtn from 'widget/FlagBtn/FlagView'
let cx = classnames.bind(styles);

const policyListView = function ({ dispatch, model, form }) {

    // 表单的子函数
    // const {resetFields, getFieldDecorator, validateFields, setFieldsValue} = form
    // 取出model对象，命名空间
    const { modelObj, namespace } = model
    // modelObj.xxx获取model中状态机的值
    const { areaList, biz ,cityList} = modelObj
    let pageProps = {
        // ---------- 界面部分 ----------
        ui: {
            // 页面接口地址
            api_url: `${config.aheadPlan}admin/policyCheck/policyCheck/list`,
            // 接口方式
            method: "GET",
            // "data_field_name":"data",
            app: "",
            // 接口参数
            params: {
                pageSize:10,
                pageNo:1,
            },
            // 模拟数据 - 用于开发需要，若填充了上面的api_url之后，请将此项设置为null
            // "mockData": mockData,
            mockData: null,
            // 模拟数据 - 用于开发需要，若填充了上面的api_url之后，请将此项设置为null
            // "mockData": mockData,
            // mockData: null,
            // 查询栏
            search_bar: {
                fields: [
                    {
                        en_name: 'reportTime',
                        zh_name: '政策发布时间',
                        elem_type: 'Date',
                        format: 'YYYY-MM-DD',
                        // query_format: "YYYY-MM-DD HH:mm:ss",   // 请求参数, 当请求参数和显示时格式不同可通过该参数区分
                        // double: true,  // 日期范围组件 使用"YYYY-MM-DD HH:mm:ss"格式时, 显示不全时可使用该参数, 将占据两格位置
                        split_keys: ['startTime', 'endTime'],
                        elem_valid_type: 'string'
                    },
                    {
                        en_name: 'areaId',
                        zh_name: '区域',
                        elem_type: 'SelectFilter',
                        elem_valid_type: 'string',
                        showSearch: true,
                        cmpt_items: areaList,
                    },
                    {
                        en_name: 'cityId',
                        zh_name: '城市',
                        elem_type: 'SelectFilter',
                        elem_valid_type: 'string',
                        showSearch: true,
                        cmpt_items: cityList,
                        onFocus:()=>{
                          if(biz.queryForm && biz.queryForm.areaId){ 
                              sessionStorage.setItem('policyAreaId',biz.queryForm.areaId)
                              dispatch({
                                type: `${namespace}/findByCity`,
                                payload: { areaId:biz.queryForm.areaId}
                              })
                          }
                        },
                    },
                    {
                        en_name: 'limitedPurchase',
                        zh_name: '限购',
                        elem_type: 'SelectFilter',
                        elem_valid_type: 'string',
                        showSearch: true,
                        cmpt_items: [
                            {
                                value: '是',
                                label: '是'
                            },
                            {
                                value: '否',
                                label: '否'
                            },
                            {
                                value: '部分限购',
                                label: '部分限购'
                            },
                        ],
                    },
                    {
                        en_name: 'limitedSales',
                        zh_name: '限售',
                        elem_type: 'SelectFilter',
                        elem_valid_type: 'string',
                        showSearch: true,
                        cmpt_items: [
                            {
                                value: '是',
                                label: '是'
                            },
                            {
                                value: '否',
                                label: '否'
                            },
                            {
                                value: '部分限售',
                                label: '部分限售'
                            },
                        ],
                    },
                    {
                        en_name: 'limitedPrice',
                        zh_name: '限价',
                        elem_type: 'SelectFilter',
                        elem_valid_type: 'string',
                        showSearch: true,
                        cmpt_items: [
                            {
                                value: '是',
                                label: '是'
                            },
                            {
                                value: '否',
                                label: '否'
                            },
                            {
                                value: '部分限价',
                                label: '部分限价'
                            },
                        ],
                    },
                    {
                        en_name: 'limitedSign',
                        zh_name: '限签',
                        elem_type: 'SelectFilter',
                        elem_valid_type: 'string',
                        showSearch: true,
                        cmpt_items: [
                            {
                                value: '是',
                                label: '是'
                            },
                            {
                                value: '否',
                                label: '否'
                            },
                            {
                                value: '部分限签',
                                label: '部分限签'
                            },
                        ],
                    },
                    {
                        en_name: 'limitedLoans',
                        zh_name: '限贷',
                        elem_type: 'SelectFilter',
                        elem_valid_type: 'string',
                        showSearch: true,
                        cmpt_items: [
                            {
                                value: '是',
                                label: '是'
                            },
                            {
                                value: '否',
                                label: '否'
                            },
                            {
                                value: '部分限贷',
                                label: '部分限贷'
                            },
                        ],
                    },
                    {
                        en_name: 'marketSignal',
                        zh_name: '市场信号',
                        elem_type: 'SelectFilter',
                        elem_valid_type: 'string',
                        showSearch: true,
                        cmpt_items: [
                            {
                                value: '宽松政策',
                                label: '宽松政策'
                            },
                            {
                                value: '趋紧政策',
                                label: '趋紧政策'
                            },
                            {
                                value: '中性政策',
                                label: '中性政策'
                            },
                        ],
                    },
                ],
                searchHandler: () => { // 自定义搜索按钮回调函数，点击搜索时触发
                    console.log('search click')
                },
                resetHandler: () => { // 自定义重置按钮回调函数，点击重置时触发
                    console.log('reset click')
                },
                searchCallback: params => { // 自定义搜索完成后的后调函数, 搜索完成后触发, 并将本次搜索的参数传入
                    console.log('search finish', params)
                },
                pasteTargetList: [  // 列表组件中将输入框的en_name作为默认id(也可以通过id另外设置)
                    'channel',  // 将需要粘贴事件拦截的输入框id以数组的形式传入, 该参数对应PasteFromClipboard组件的targetList参数
                ]
            },
            // 数据表格  序号 行政区域 限购  限售 限价 限签 限贷 更新人 更新时间 操作
            table:
            {
                status_params: "status=0",
                status_text: "全部",
                // 表头字段列表
                scroll: { x: 1400 },
                fields: [
                    {
                        en_name: "ruleNo",
                        zh_name: "序号",
                        width: 60,
                        render: (a, item, index, d, e, f) => {
                            return index + 1
                        },
                    },
                    {
                        en_name: "areaName",
                        zh_name: "区域",
                    },
                    {
                        en_name: "cityName",
                        zh_name: "城市",
                    },
                    {
                        en_name: "marketSignal",
                        zh_name: "市场信号",
                    },
                    {
                        en_name: "limitedPurchase",
                        zh_name: "限购",
                    },
                    {
                        en_name: "limitedSales",
                        zh_name: "限售",
                    },
                    {
                        en_name: "limitedPrice",
                        zh_name: "限价",
                    },
                    {
                        en_name: "limitedSign",
                        zh_name: "限签",
                    },
                    {
                        en_name: "limitedLoans",
                        zh_name: "限贷",
                    },
                    {
                        en_name: "updateBy",
                        zh_name: "更新人",
                    },
                    {
                        en_name: "updateTime",
                        zh_name: "更新时间",
                    },
                    {
                        en_name: "policyPublishTime",
                        zh_name: "政策发布时间",
                    },
                    {
                        en_name: "edit",
                        zh_name: "操作",
                        width: 130,
                        fixed: 'right',
                        render: (a, item, index, d, e, f) => {
                            return (
                                <span>
                                    <FlagBtn node={<a onClick={() => addOrEditSkip('cook', item)}>复制<span className="ant-divider" /></a>} btnId={''}> </FlagBtn>
                                    <FlagBtn node={<a onClick={() => addOrEditSkip('edit', item)}>编辑</a>} btnId={''}> </FlagBtn>
                                </span>
                            )
                        },
                    }
                ]
            },
            // 操作栏
            action_bar: [
                {
                    label: "新增",
                    type: "primary",
                    onClick: (e, row) => {
                        hashHistory.push({
                            pathname: '/home/predictManage/policyEdit',
                            query: {}
                        })
                    }
                }
            ]
        },
    }

    // 查看及编辑跳转
    function addOrEditSkip(type, item) {
        hashHistory.push({
            pathname: '/home/predictManage/policyEdit',
            query: { actionType: type, id: item.id }
        })
    }

    if (!!modelObj.biz) {
        pageProps.biz = modelObj.biz
        pageProps.biz.syncBackCbf = (biz) => {
            dispatch({
                type: `${namespace}/updateStore`,
                payload: { biz }
            })
        }
    }

    return (
        <div className={cx('pageLayout')}>
            <ListPage pageProps={pageProps} />
        </div>
    )
}


// 连接视图(view)和模型(model)
export default connect(mapStateToProps)(Form.create()(policyListView))